<template>
	<div>
		<div class="header-bg">
			<div class="header">
				<span @click="goHome">首页</span>
				<span @click="goText">写写心得</span>
				<span @click="goGod">关于本尊</span>
			</div>			
		</div>
	</div>
</template>

<script>
	export default {
		methods:{
			goHome(){
				this.$router.push({name:'home'})
			},
			goText(){
				if(sessionStorage.getItem('user')=='master'){
					this.$router.push({name:'text'})
				}else{
					this.$Message.error('没有权限,给我滚!');
				}
			},
			goGod(){
				this.$router.push({name:'god'})
			}
		}
	}
</script>

<style scoped>
	.header-bg {
		height: 56px;
		background: rgba(36,33,46,0.48);
		position: fixed;
		top: 0;
		width: 100%;
		z-index: 5;
	}
	.header {
		width: 1376px;
		margin:0 auto ;
		display: flex;
	}
	.header span {
		height: 56px;
		padding: 0 26px;
		cursor: pointer;
		display: flex;
		align-items: center;
		color: #fff;
	}
	.header span:hover {
		background: rgba(0, 0, 0,.5);
	}
	@media screen and (max-width: 1600px) {
		.header {
			width: 1136px;
		}
	}
</style>